<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        .box{background: #ccc;padding:10px;}
        .box p{background: #efefef;line-height: 30px;}
    </style>
</head>
<body>
    <div class="box">
        <p class="abc">段落1</p>
        <p class="abc">段落2</p>
        <p>段落3</p>
        <p class="abc">段落4</p>
        <p>段落5</p>
        <p>段落6</p>
        <div class="abc">小盒子</div>
    </div>
</body>
<script>

    // var ap = document.querySelectorAll(".box p");
    // for(var i=0;i<ap.length;i++){
    //     ap[i].onclick = function(){
    //         console.log( this );
    //     }
    // }
    
    var oBox = document.querySelector(".box");
    oBox.onclick = function(eve){
        var e = eve || window.event;
        var target = e.target || e.srcElement;
        if( target.className === "abc" ){
            console.log(target);
        }
    }


    

</script>
</html>